<template>
	<view class=" pl30 pr30 pb30">
		<!-- <goodsList :type="3" :goodslist="goodsList"/> -->
		<block v-for="(item,index) in goodsList" :key="index">
			<view class="fs30 mt30" >{{index}}</view>
			<view class="flex flex-wrap row-between">
				<view class="radius16 goodsItem" v-for="(item2,i) in item" :key='i' @click="$jump('/subpkg/goodsDetail/goodsDetail?spu='+item2.spu)">
					<!-- 上面的图片 -->
					<image :src="item2.goods.img" class="w-max h330 radius16"></image>
					<!-- //上面的图片 -->
					<!-- 下面的盒子 -->
					<view class="mt20 pl20 pr20 ">
						<view class="mb20">{{item2.goods.name}}</view>
						<view class="flex row-between col-center">
							<view class="color9 fs24">
								<text>销量 </text>
								<text>{{item2.goods.sales}}</text>
							</view>
							<text class="color-red fs36">¥ {{item2.goods.price}}</text>
						</view>
					</view>
					<!-- //下面的盒子 -->
				</view>
			</view>
		</block>
	</view>
</template>

<script>
	// import goodsList from '@/components/goodsList/goodsList.vue'
	export default {
		// components:{goodsList},
		onLoad() {
			this.init()
		},
		data() {
			return {
				query:{
					page:1,
					size:10
				},
				goodsList:[]
			};
		},
		methods:{
			init(e) {
				e=='down'?this.query.page++:this.query.page=1
				this.$api.myFootprint(this.query).then(res=>{
					console.log(res)
					this.goodsList=e=='down'?[...this.goodsList,...res.data]:res.data
					// res.data.forEach(item=>{
					// 	this.goodsList.push(item.goods)
					// })
				})
			}
		},
		onReachBottom() {
			this.init('down')
		}
	}
</script>

<style lang="scss">
	.goodsItem {
		width: 48%;
		background-color: #FFFFFF;
		padding-bottom: 20rpx;
		margin-top: 30rpx;
	}
</style>
